<template >
<div class="wrapper">
              <v-head @getContDiv="handerHead"></v-head>
              <v-sidebar></v-sidebar>
              <div :class="['content-box', showClass ? 'content-collapse' : '']" >
              <div class="content_wrapper">
              <v-tags></v-tags>
              <div class="container form02">
              <div style="height: 40px;"> <span>任务管理 <i class="el-icon-caret-right"></i> 任务配置</span> <div style="float : right"><el-button icon="el-icon-back" @click="back">返回</el-button></div></div><hr style="border: 1px solid #f7f9fa;">
                    <el-form :label-position="labelPosition" :rules="rules" ref="form2" :label-width="labelWidth" :inline="false" :model="form2" class="demo-form-inline">
                        <el-form-item label="自动解析" prop="autoParse" value="form2.autoParse">
                               <el-radio  v-model="form2.autoParse" label="true" value=true>自动解析</el-radio>
                                <el-radio  v-model="form2.autoParse" label="false" value=false>不自动解析</el-radio>
                        </el-form-item>
                        <el-form-item label="自动爬取" prop="resumable">
                               <el-radio-group v-model="form2.resumable">
                                  <el-radio label="true" value=true>自动爬取</el-radio>
                                  <el-radio label="false" value=false>不自动爬取</el-radio>
                               </el-radio-group>
                        </el-form-item>
                        <el-form-item label="爬取间隔" prop="executeInterval">
                            <el-input type="number" min="0" v-model="form2.executeInterval" placeholder="爬取间隔，单位毫秒"></el-input>
                        </el-form-item>
                        <el-form-item label="线程数" prop="thread">
                            <el-input type="number" min="0" v-model="form2.thread" placeholder="线程数"></el-input>
                        </el-form-item>
                        <el-form-item label="爬取深度" prop="depth">
                             <el-input type="number" min="0" v-model="form2.depth" placeholder="爬取深度"></el-input>
                        </el-form-item>
                        <el-form-item label="迭代数量" prop="topn">
                             <el-input type="number" min="0" v-model="form2.topn" placeholder="迭代数量"></el-input>
                        </el-form-item>
                        <el-form-item label=" ">
                            <el-button type="primary" @click="onSubmit2">提交</el-button>
                        </el-form-item>
                    </el-form>
                </div>
                              </div>
                              <v-footer></v-footer>
                          </div>

                      </div>
              </div>

</template>
<style lang="scss">
// 设置输入框的宽度
.form02 {
  .el-form-item__content {
    width: 330px;
    .el-select {
      width: 330px;
    }
  }
}
.el-checkbox-group .el-checkbox {
  margin-left: 0;
  padding-right: 30px;
}
</style>
<script>
import apis from '../../apis/apis';
import vHead from '../common/Header.vue';
import vSidebar from '../common/Sidebar.vue';
import vTags from '../common/Tags.vue';
import vFooter from '../common/Footer.vue';
import bus from '../common/bus';
export default {
  name: "form02",
  data() {
    return {
      showClass :false,
      form2: {
        autoParse : "",
        resumable: "",
        executeInterval: "",
        thread: "",
        depth: "",
        topn: "",
        taskId : this.$route.query.taskId
      },
      labelPosition: "right", //lable对齐方式
      labelWidth: "80px", //lable宽度
      rules:  {
        executeInterval: [{ required: true, message: "请输入爬取间隔", trigger: "blur" }],
        thread: [
          { required: true, message: "请输入线程数", trigger: "change" }
        ],
        autoParse: [
          { required: true, message: "请选择是否自动解析", trigger: "change" }
        ],
        resumable: [
          { required: true, message: "请选择是否自动爬取", trigger: "change" }
        ],
        depth: [
          { required: true, message: "请输入爬取深度", trigger: "change" }
        ],
        topN : [
          {required : true, message : "请输入迭代数量" , trigger : "change"}
        ]
        }
    };
  },
  computed:{

  },
  mounted(){
       this.onLoad();
   },
  methods: {
  fillAutoParse (autoparse){
    this.form2.autoParse=autoparse;
  },
  handerHead (){
     this.showClass==true?(this.showClass=false):(this.showClass=true);
  },
  back (){
      this.$router.go(-1);
  },
    //表单2提交
    onSubmit2() {
      var that =this;
      this.$refs["form2"].validate(valid => {
        if (valid) {
              let param = Object.assign({}, this.form2);
              apis.generatorlistApi.addGenerator(param).then((data)=>{
                    this.listLoading=false;
                        if (data && data.data) {
                            var json = data.data;
                                if (json.successed) {
                                     this.$message({message: json.message,type: "success"});
                                     that.onLoad ();
                                }
                                else if (json.message) {
                                        this.$message({message: json.message,type: "error"});
                                }
                        }
              }).catch((err)=>{
                     this.listLoading=false;
                     this.$message({message: '添加失败，请重试',type: "error"});
              })
        }else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    onLoad () {
            var that = this;
            let param_ ={
            taskId :  this.form2.taskId
            }
            let param = Object.assign({}, param_);
            apis.generatorlistApi.selectByTaskId(param)
            .then((data)=>{
                 if(data.data.successed){
                      var json=data.data.data;
                      console.log(json);
                      that.form2.executeInterval=json.executeInterval;
                      that.form2.resumable=json.resumable;
                      //that.form2.autoParse=json.autoParse;
                      that.fillAutoParse(json.autoParse);
                      that.form2.thread=json.thread;
                      that.form2.depth=json.depth;
                      that.form2.topn=json.topn;
                      console.log(data.data);
                 }
                console.log(data);
            }).catch((err)=>{
                 this.listLoading=false;
                 this.$message({message: '查询失败，请重试',type: "error"});
            })
    }
  },
  components: {
                vHead, vSidebar, vTags, vFooter
            },
      created() {
               bus.$on('collapse', msg => {
                        this.collapse = msg;
               })
       // 只有在标签页列表里的页面才使用keep-alive，即关闭标签之后就不保存到内存中了。
               bus.$on('tags', msg => {
                        let arr = [];
                        for (let i = 0, len = msg.length; i < len; i++) {
                            msg[i].name && arr.push(msg[i].name);
                        }
                        this.tagsList = arr;
               })
   },
};
</script>
